<section class="page_section" id="about">
    <!-- section header -->
    <header>
        <div class="container">
        <h1>魔岩简介</h1>
            <p>Grimrock 是一个由设计师、程序员组成的团队，我们愿意用自己的绵薄之力，给大家带来不一样的体验。</p>
        </div><!-- end .container -->
    </header>
    <!-- //section header -->
    
    <!-- section content -->
    <div class="content_section container"> 
        <div class="row">
            <div class="col-md-4">
                <div class="img_round_box">
                    <div class="img_block hover_img">
                    <a href="static/images/about.jpg" class="prettyPhoto" data-rel="prettyPhoto[about]" rel="prettyPhoto[about]">
                            <img src="static/images/about.jpg" alt="">

                            <div class="item_fadder"></div>
                            <div class="link_ico"><i class="fa fa-search"></i></div>
                        </a>
                    </div>
                </div>
            </div>
            <div class="col-md-8">
                <blockquote style="margin-top:4em;">
                    <p>魔岩出品，必属精品。</p>

                    <p class="author">——机锋网友。</p>
                </blockquote>
                <p style="line-height:24px;">我们是一个由设计师、程序员组成的技术团队，<br>
                    崇尚开源，乐于为粉丝及志同道合的朋友们提供高质量的设计素材，<br>
                    专注分享，致力于让技术为生活带来便利，坚信技术可以改变世界。<br>
                    团队由机锋GROM开发组、MOKEE开发组及EMUI开发组成员构成，<br>
                    共同的爱好让我们走到一起，长期的友谊定能带我们走的更高、更远。
                </p>
            </div>
        </div>
        <div class="divider"></div>                 
        <div class="row">
            <div class="col-md-3">
                <div class="service skill" data-color="#1baa9f">
                    <div class="skill_wrap">
                        <div class="skill_text easyPieChart" data-percent="87" style="width: 90px; height: 90px; line-height: 90px;">87<span>%</span><canvas width="90" height="90"></canvas></div>
                    </div>
                    <span class="service_title">网站开发</span>

                    <p>响应式设计，个性化定制，PHP,JAVA....It's ok !
                    </p>
                </div>
            </div>
            <div class="col-md-3">
                <div class="service skill" data-color="#bb8673">
                    <div class="skill_wrap">
                        <div class="skill_text easyPieChart" data-percent="19" style="width: 90px; height: 90px; line-height: 90px;">19<span>%</span><canvas width="90" height="90"></canvas></div>
                    </div>
                    <span class="service_title">界面设计</span>

                    <p>个性化设计的同时也乐于分享团队资源，大家的欣赏，是我们进步的动力。
                    </p>
                </div>
            </div>
            <div class="col-md-3">
                <div class="service skill" data-color="#fe634e">
                    <div class="skill_wrap">
                        <div class="skill_text easyPieChart" data-percent="58" style="width: 90px; height: 90px; line-height: 90px;">58<span>%</span><canvas width="90" height="90"></canvas></div>
                    </div>
                    <span class="service_title">图标设计</span>

                    <p>一个独特的站标？一套美观的图标？魔岩，会给你满意的答案。</p>
                </div>
            </div>
            <div class="col-md-3">
                <div class="service skill" data-color="#e0de19">
                    <div class="skill_wrap">
                        <div class="skill_text easyPieChart" data-percent="75" style="width: 90px; height: 90px; line-height: 90px;">75<span>%</span><canvas width="90" height="90"></canvas></div>
                    </div>
                    <span class="service_title">软件开发</span>

                    <p>科技改变世界，技术服务生活，我们固执的相信，程序猿，会改变世界！</p>
                </div>
            </div>
        </div>               
        <div class="divider70"></div>
        <div class="clear"></div>
        <a href="#works" class="next_section"></a>
    </div>
    <!-- //section content -->
</section>        